<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <title>{v}</title>
    <style>
        body {
            text-align: center;
            font-family: verdana;
        }
        .c {
            text-align: center;
        }
        div, input {
            padding: 5px;
            font-size: 1em;
        }
        input {
            width: 95%;
        }
        button {
            border: 0;
            border-radius: 0.3rem;
            background-color: #007BFF; /* 更新的颜色 */
            color: #fff;
            line-height: 2.4rem;
            font-size: 1.2rem;
            width: 100%;
        }
        .q {
            float: right;
            width: 64px;
            text-align: right;
        }
        .l {
            background: url("") no-repeat left center;
            background-size: 1em;
        }
    </style>
</head>
<body>
<div style="text-align:left;display:inline-block;min-width:260px;">
    <form action="/wifi" method="get">
        <button>配置WiFi</button>
    </form>
    <br/>
    <form action="/0wifi" method="get">
        <button>配置WiFi(无扫描)</button>
    </form>
    <br/>
    <form action="/i" method="get">
        <button>信息</button>
    </form>
    <br/>
    <form action="/r" method="post">
        <button>复位</button>
    </form>
    <br/>
    <div><a href='#p' onclick='c(this)'>{v}</a>&nbsp;<span class='q {i}'>{r}%</span></div>
    <form method='get' action='wifisave'>
        <input id='s' name='s' length=32 placeholder='WiFi名'>
        <br/>
        <input id='p' name='p' length=64 type='password' placeholder='密码'>
        <br/>
        <!-- 动态添加表单参数 -->
        <br/>
        <button type='submit'>保存</button>
    </form>
    <br/>
    <div class="c">
        <a href="/wifi">扫描</a>
    </div>
    <div>
        密码已保存<br />ESP正在尝试连接WiFi。<br />如果WiFi连接失败，请再次连接AP并进行WiFi设置。
    </div>
</div>
</body>
</html>